<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<title>JOYRICH 报名页</title>
	<script src="js/wen.js"></script>
	<link rel="stylesheet" href="css/reset.css">
	<link rel="stylesheet" href="css/toupiao.css">
</head>
<body class="baoming">
    <div class="wrap">
          <header>
              <img src="images/p7_img.jpg" alt="" title="">
              <span></span>
          </header>
          <div class="mian">
                <form class="biao1" action="">
                    <div>
                        <label for="xs">院校</label>
                        <input type="text" id="xs" name="" value="">
                    </div>
                    <div>
                        <label for="xm">姓名</label>
                        <input type="text" id="xm" name="" value="">
                    </div>
                    <div>
                        <label for="xb">性别</label>
                        <input type="text" id="xb" name="" value="">
                    </div>
                    <div class="tel">
                        <label for="tel">联系电话</label>
                        <input  type="text" id="tel" name="" value="" onkeyup="value=value.replace(/[^1234567890-]+/g,'')" maxlength="11">
                    </div>
                    <div class="text">
                        <label for="csxy">参赛宣言</label>
                        <textarea name="" id="csxy" cols="30" rows="10"></textarea>
                    </div>
                    <div class="file">
                          <label for="face">点击上传照片</label>
                    </div>
                    <div class="submit">
                        <button>提交报名</button>
                        <button type="button">
                            <a href="" title="">官方V商城</a>
                        </button>
                    </div>
                </form>
                <!-- 上传照片所用的表单 -->
                <form class="upload-form" action="" style="display:none;">
                    <div>
                        <input type="file" id="face" name="" value="" capture="photo">
                    </div>
                </form>
          </div>
    </div>
    <script src="js/zepto.min.js"></script>
    <script>
        $("#xb").blur(function(event) {
            var val = $(this).val();
            var val1 = val.replace(/\s/g,"");
            var str = val1[0];
            if((str === "男")||(str ==="女")) {
                $(this).val(str);
            } else {
                $(this).val("");
            }
        })
        $(".baoming .biao1 .submit button").on("touchstart", function() {
            $(this).css({
                "box-shadow": "-2px -2px 2px 0 #8d7a1f"
            })
        });
         $(".baoming .biao1 .submit button").on("touchend", function() {
            $(this).css({
                "box-shadow": "2px 2px 2px 0 #8d7a1f"
            })
        });
    </script>
</body>
</html>